<template>
  <div>
    <!-- 标题点击跳转 -->
    <a
      v-if="allUrl"
      target="_blank"
      :alt="title"
      class="module-page-title flex-center-wrap flex-justify-between"
    >
      {{ title }}
    </a>

    <!-- 标题不可点击 -->
    <h3 v-else class="module-page-title flex-center-wrap flex-justify-between">
      <span>
        {{ title }}
      </span>

      <a
        class="flex-center-wrap t-u-n"
        target="_blank"
        :href="rightUrl"
        v-if="rightStr"
      >
        <span class="new-info-more d-b">{{ rightStr }}</span>
        <img
          src="//image.zlketang.com/public/news/images/xueliwxpub_center/arrow_right.png"
          class="new-info-box-arrow"
          :alt="rightStr"
        />
      </a>
    </h3>
  </div>
</template>

<script>
export default {
  props: {
    title: {
      type: String,
      default: ''
    },
    rightStr: {
      type: String,
      default: ''
    },
    allUrl: {
      type: String,
      default: ''
    },
    rightUrl: {
      type: String,
      default: ''
    }
  },
  data() {
    return {}
  },
  methods: {}
}
</script>

<style scoped>
.new-info-box-arrow {
  width: 8px;
  height: 12px;
}
.new-info-more {
  height: 20px;
  font-size: 14px;
  font-weight: 400;
  color: #999999;
  line-height: 20px;
  margin-right: 6px;
}
.t-u-n {
  text-decoration: none;
}
</style>
